<template>
    <div class="dynamic">  
         <van-pull-refresh v-model="isLoading"   @refresh="onRefresh"> 
        <div class="content">
            <ul>
                <li >
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
                 <li >
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
                 <li >
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
                 <li>
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
                  <li >
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
                 <li >
                    <img src="../../assets/img/find/find_01.png" alt="">
                    <p>累到劈叉=.=</p>
                    <div class="user_info"><img src="../../assets/img/find/heads1.png" alt="">&nbsp;<span>OMINI.BASS</span></div>
                </li>
            </ul>
        </div>
         </van-pull-refresh>
    </div>
</template>

<script>
    import Vue from 'vue';
    import { PullRefresh ,Toast } from 'vant';

    Vue.use(PullRefresh);
   import DisTopBar from "../../component/DisTopBar";
   import BottomBar from "../../component/BottomBar"
    export default {
        name: "DynamicPag",
        data() {
            return {
            count: 0,
            isLoading: false,
            }
        },
        components:{
            DisTopBar,
            BottomBar

        },
            methods: {
            onRefresh() {
            setTimeout(() => {
                Toast('刷新成功');
                this.isLoading = false;
                this.count++;
            }, 1000);
            },
        },
        
    }

</script>
<style lang='stylus' scoped>

    .content
        overflow-y scroll
        height  4.8rem
        ul 
            padding-left .15rem
            height max-content
        li
            display inline-block
            width 1.65rem
            border-radius .2rem
            box-shadow:0px 0px 5px #e5e5e5;
            margin-right .15rem
            font-size .16rem
            color #16191c
            img 
                width 100%
            p
                padding-left .1rem
            .user_info
                padding .02rem  0 .1rem .1rem 
                img 
                    width .2rem
                span 
                    display inline-block
                    height .2rem
                    line-height .2rem
                    padding-left .08rem
                    color #ccc
                    font-size .14rem
                    text-align center

        
</style>